<template>
	<view class="box">
		<view class="contented">
			<view class="top">
				<view class="count flex_wrap row_middle row_center">
					<text>张数</text>
					<text class="countt">{{countNum}}</text>
				</view>
				<view>
					<u-text :text="detailInfo.favorableTitle" size="56rpx" color="#FF3C3C" align="center" margin="26rpx 0 20rpx" />
					<u-text :text="detailInfo.favorableDescription" size="28rpx" color="#3D3D3D" align="center" />
					<u-text :text="`有效期限至` +  $u.timeFormat(detailInfo.useTimeEnd, 'yyyy.mm.dd')" size="28rpx" color="#666" align="center" margin="16rpx 0 48rpx" />
				</view>
				<view class="u-line">
					<u-line dashed color="#D8D8D8" />
				</view>
			</view>
			<u-gap height="64rpx"></u-gap>
			<view class="bottom">
				<view>
					<view class="flex_wrap row_center">
						<u-image
							:src="baseSrc"
							width="320rpx" height="320rpx" mode="widthFix" />
					</view>
					<u-gap height="32rpx"></u-gap>
					<u-text :text="'扫码领取'+countNum+'张优惠券'" size="32rpx" color="#FF3C3C" align="center" />
					<u-gap height="64rpx"></u-gap>
				</view>
				<view class="list flex_wrap flex_column">
					<u-row align="top">
						<u-col span="3"><u--text text="适用规则：" color="#666" size="28rpx" /></u-col>
						<u-col span="8"><u--text :text="detailInfo.favorableDescription" color="#666"
								size="28rpx" /></u-col>
					</u-row>
					<u-gap height="32rpx" ></u-gap>
					<u-row align="top">
						<u-col span="3"><u--text text="店铺地址：" color="#666" size="28rpx" /></u-col>
						<u-col span="8"><u--text text="--" color="#1682FF"
								size="28rpx" /></u-col>
					</u-row>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { favorableDetail,transfer} from "@/api/coupon.js";
	
	
	import { getFavorableInfoById} from "@/api/order.js";
	import { storeInRedis ,getMiniCodeByAppId} from "@/api/order.js";
	import { baseUrl } from "@/config/tendIdConfig"
	import { mapGetters } from "vuex"
	export default {
		data() {
			return {
				ledId:'',
				detailInfo:'',
				baseSrc: "",
				appId: this.$appId,
				countNum:'',
				uniqueId:''
			};
		},
		computed: {
			...mapGetters([ "userInfo"])
		},
		mounted() {
			this.getSalesmanInfo()
		},
		onLoad(options) {
			this.countNum = options.couponNum
			this.ledId = options.ledId
			this.uniqueId = options.uniqueId
			this.getCouponDetail(this.ledId)
		},
		methods: {
			getSalesmanInfo() {
			    const token =
			        this.$store.getters?.customer_token ||
			        uni.getStorageSync("customer_token");
			    const that = this;
			    uni.request({
			        url: baseUrl + "/customer/customer/getCustomerInfoByToken",
			        method: "GET",
			        header: {
			            Authorization: token,
			        },
			        success(res) {
			            that.salesmanUserId = res.data.data.id;
						// that.transferCoupon()
			        },
			    });
			},
			// transferCoupon(){
			// 	const params = {
			// 		number :this.countNum,
			// 		favorableLedId: this.ledId,
			// 		source:1
			// 	}
			// 	transfer(params).then((res) => {
			// 		if(res.code == 200){
			// 			this.scene = res.data;
			// 			this.getMiniCode()
			// 		}else{
			// 			uni.$u.toast(res.data.msg)
			// 		}
			// 	});
			// },
			getMiniCode(){
				const that = this;
				const params = {
				   page: "pages_coupon/receive/index",
				   scene:that.uniqueId,
				   env_version: __wxConfig.envVersion,
				   check_path: false,
				   appId: that.appId,
				};
				getMiniCodeByAppId(params).then((res) => {
				    if (res.code === 200 && res.data) {
				       var showImgData = res.data;
				       that.baseSrc = "data:image/png;base64," + showImgData;
				    }
				});
			},
			
			getCouponDetail(ledId){
				getFavorableInfoById(ledId).then((res) => {
					if (res.code === 200 && res.data) {
					   this.detailInfo = res.data
					   this.getMiniCode()
					}
				});
			},
		},
	};
</script>

<style lang="scss">
	page {
		background-color: #1E2137;
	}

	.box {
		padding: 32rpx 28rpx;
	}

	.contented {
		background-image: url('https://oneredhealth.oss-cn-hangzhou.aliyuncs.com/2024/01/09/717a56be5f3e48a791943c3a3b21c8fd.png');
		width: 100%;
		background-repeat: no-repeat;
		height: 660rpx;
		background-size: 100% 100%;
		position: relative;
	}
	.top{
		padding: 44rpx 28rpx 0;
	}
	.bottom{
		padding: 0 28rpx 64rpx;
		background-color: #fff;
		border-radius: 12rpx;
	}

	.count {
		font-size: 32rpx;
		color: #DCB210;

		.countt {
			font-size: 48rpx;
			margin-left: 12rpx;
		}
	}
.u-line{
	padding: 0 30rpx;
}
</style>